
<template>
    <div class="app-container">
        <!--查询数据-->
        <div class="SearchTop">
            <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch">
                <el-form-item label="租户名称：">
                    <el-input v-model="queryParams.name" placeholder="请输入名称" clearable @keyup.enter="handleQuery" />
                </el-form-item>
                <el-form-item label="联系人：">
                    <el-input v-model="queryParams.contactBy" placeholder="请输入联系人" clearable
                        @keyup.enter="handleQuery" />
                </el-form-item>
                <el-form-item label="到期时间：">
                    <el-date-picker v-model="queryParams.lastExpiredTime" value-format="YYYY-MM-DD" type="date"
                        @change="changeExpiredTime" placeholder="请选择到期时间"></el-date-picker>
                </el-form-item>
                <el-form-item label="租户状态：">
                    <el-select v-model="queryParams.status" placeholder="租户状态" clearable>
                        <el-option v-for="dict in tenant_status" :key="dict.value" :label="dict.label"
                            :value="dict.value" />
                    </el-select>
                </el-form-item>
                <el-row class="searchBtn">
                    <el-col :span="8">
                        <el-form-item>
                            <el-button type="primary" icon="Search" @click="handleQuery"
                                v-hasPermi="['tenant:tenant:list']">查询
                            </el-button>
                            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
                        </el-form-item>
                    </el-col>
                    <el-col :span="5">
                        <el-form-item>
                            <el-button type="primary" plain icon="Plus" @click="handleAdd"
                                v-hasPermi="['tenant:tenant:add']">
                                新增租户
                            </el-button>
                            <el-button @click="handleExport" type="info" plain icon="Download"
                                v-hasPermi="['tenant:tenant:export']">导出</el-button>
                            <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete"
                                v-hasPermi="['tenant:tenant:remove']">删除</el-button>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <showUp :showSearch="showSearch" @showUp="packUp"></showUp>
        </div>
        <!--表格数据-->
        <div class="tableList">
            <el-table :data="tableData" v-loading="loading" style="width: 100%" border class="table-container" stripe
                align="center" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55"> </el-table-column>
                <el-table-column label="序号" width="60" type="index"> </el-table-column>
                <template v-for="(item, index) in tableHead" :key="index">
                    <el-table-column :prop="item.dataIndex" :label="item.title" :align="center" show-overflow-tooltip>
                        <template #default="scope" v-if="item.dataIndex == 'status'">
                            <span>
                                <el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0"
                                    @change="handleStatusChange(scope.row)">
                                </el-switch>
                            </span>

                        </template>
                    </el-table-column>
                </template>

                <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
                    <template #default="scope">
                        <a @click="handleCombo(scope.row)" title="套餐">
                            <img src="../../../assets/images/manage/taocan.png" alt="" />
                        </a>
                        <a @click="handleView(scope.row)" title="查看" v-hasPermi="['tenant:tenant:query']">
                            <img src="../../../assets/images/manage/xiangq.png" alt="" />
                        </a>
                        <a @click="handleUpdate(scope.row)" title="编辑" v-hasPermi="['tenant:tenant:edit']">
                            <img src="../../../assets/images/manage/bianji.png" alt="" />
                        </a>
                        <a @click="handleDelete(scope.row)" title="删除" v-hasPermi="['tenant:tenant:remove']">
                            <img src="../../../assets/images/manage/shanchu.png" alt="" />
                        </a>

                        <a @click="handleLoading(scope.row)" title="重载租户数据源" v-hasPermi="['DataSourceConfig:loading']">
                            <img src="../../../assets/images/manage/chongzai.png" alt="" />
                        </a>
                        <a @click="handleDataInit(scope.row)" title="租户数据源数据初始化"
                            v-hasPermi="['DataSourceConfig:datainit']">
                            <img src="../../../assets/images/manage/sju.png" alt="" />
                        </a>
                    </template>
                </el-table-column>
            </el-table>
            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
                v-model:limit="queryParams.pageSize" @pagination="getList" />
        </div>
        <addTenant ref="addFrom" @refresh="getList"></addTenant>
        <tenantDetails ref="detailFrom" @refresh="getList">
        </tenantDetails>
        <comboList ref="comboFrom"></comboList>
    </div>
</template>
<script setup >

import showUp from '@/components/packUp'
import tenantDetails from './tenantDetails'
import comboList from './comboList'
import addTenant from './addTenant'

import { listTenant, delTenant, updateTenantComboStatus, updateStatus, loadingSource, dataInit } from '@/api/tenant/tenant'
const { proxy } = getCurrentInstance();
const { tenant_status } = proxy.useDict("tenant_status");
const showSearch = ref(true);
const loading = ref(true);
const ids = ref([]);
const isDisabled = ref(false);
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
const data = reactive({
    form: {},
    queryParams: {
        pageNum: 1,
        pageSize: 10,
        name: undefined,
        status: undefined,
        contactBy: undefined,
        lastExpiredTime: undefined,
    },
    tableHead: [
        {
            dataIndex: 'name',
            title: '租户名称',

        },

        {
            dataIndex: 'contactBy',
            title: '联系人',

        },
        {
            dataIndex: 'contactPhone',
            title: '联系电话',

        },
        {
            dataIndex: 'sales',
            title: '销售人员',

        },
        {
            dataIndex: 'status',
            title: '租户状态',

        },
    ],
    tableData: []
});

const { queryParams, form, tableHead, tableData } = toRefs(data);
/** 查询列表 */
function getList() {
    loading.value = true;
    listTenant(queryParams.value).then(response => {
        //  console.log('zuhu55555', response)
        if (response.code == 200) {
            tableData.value = response.rows
            total.value = response.total;
            loading.value = false;
        }
    })
}
//收起查询栏
function packUp() {
    showSearch.value = !showSearch.value

}
/** 搜索按钮操作 */
function handleQuery() {
    queryParams.value.pageNum = 1;
    getList();
}
/** 重置按钮操作 */
function resetQuery() {
    queryParams.value = {
        lastExpiredTime: undefined
    }
    proxy.resetForm("queryRef");
    handleQuery();
}
/** 多选框选中数据 */
function handleSelectionChange(selection) {
    console.log('selection', selection)
    ids.value = selection.map(item => item.id);
    single.value = selection.length != 1;
    multiple.value = !selection.length;
}
//导出
function handleExport() {
    proxy.download("/tenant/export", {
        ...queryParams.value,
    }, `租户_${new Date().getTime()}.xlsx`);
}
async function handleAdd() {
    // visible.value = true;
    proxy.$refs["addFrom"].add();
}
function handleUpdate(row) {
    proxy.$refs["detailFrom"].edit(row);
}
function handleView(row) {
    proxy.$refs["detailFrom"].view(row);
}
/** 删除按钮操作 */
function handleDelete(row) {
    const tenantids = row.id || ids.value;
    proxy.$modal.confirm('是否确认删除此租户？').then(function () {
        return delTenant(tenantids);
    }).then(() => {
        getList();
        proxy.$modal.msgSuccess("删除成功");
    }).catch(() => { });
}
/** 租户状态修改  */
function handleStatusChange(row) {
    let text = row.status === 1 ? "启用" : "停用";
    proxy.$modal.confirm('确认要"' + text + '""' + row.name + '"租户吗?').then(function () {
        return updateStatus(row.id, row.status);
    }).then(() => {
        proxy.$modal.msgSuccess(text + "成功");
    }).catch(function () {
        row.status = row.status === 1 ? 0 : 1;
    });
};
function changeExpiredTime(val) {
    //  console.log('fddfd', val);
    queryParams.value.lastExpiredTime = val + ' ' + '23:59:59'
}
function handleCombo(row) {
    proxy.$refs["comboFrom"].edit(row);
}
function handleLoading(row) {
    const id = row.id
    proxy.$modal.confirm('是否要重载此租户数据源？').then(function () {
        return loadingSource(id)
    }).then(() => {
        proxy.$modal.msgSuccess("重载成功");
    }).catch(function () {

    });

}
function handleDataInit(row) {
    const id = row.id

    proxy.$modal.confirm('是否要初始化此租户数据源数据？').then(function () {
        return dataInit(id)
    }).then(() => {
        proxy.$modal.msgSuccess("初始化成功");
    }).catch(function () {

    });
}
getList()
</script>
